<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>整合版</title>
    <link rel="stylesheet" href="ext-4.2.1.883/resources/css/ext-all.css">
    <script type="text/javascript" src="ext-4.2.1.883/ext-all.js"></script>
    <script type="text/javascript" src="ext-4.2.1.883/locale/ext-lang-zh_CN.js"></script>
</head>
<body>
<script type="text/javascript">

    Ext.onReady(function () {
        Ext.create('Ext.window.Window', {
            title: 'Hello',
            height: 200,
            width: 400,
            layout: 'fit',
            items:addForm
        }).show();
    })

    var addForm = Ext.create('Ext.form.Panel',{
        title:'添加用户',
        bodyPadding:5,
        width:350,

        //Ajax请求URL
        url:'http://localhost:8080/user/addUser.do',

        layout:'anchor',
        defaults:{
            anchor:'100%'
        },

        defaultType:'textfield',
        //表格区域
        items:[{
            fieldLabel:'username',
            name:'username',
            allowBlank:false
        },{
            fieldLabel:'password',
            name:'password',
            allowBlank:false
        },{
            fieldLabel:'email',
            name:'email',
            allowBlank:false
        }],
        //添加按钮
        buttons:[{
            text:'添加',
            formBind:true,
            disabled:true,
            handler: function () {
                var form = this.up('form').getForm();
                if (form.isValid()){
                    form.submit({
                        success: function (form,action) {
                            //Ext.msg.alert(String title,String context)第一个是标题,第二个是内容
                            Ext.Msg.alert('添加成功',action.result.msg);
                        },
                        failure:function (form,action) {
                            Ext.Msg.alert('添加失败',action.result.msg);
                        }
                    });
                }
            }
        }, {
            text: '重置',
            handler: function () {
                this.up('form').getForm().reset();
            }
        }]
    });

    var deleteForm = Ext.create('Ext.form.Panel',{
        title:'删除用户',
        bodyPadding:5,
        width:360,

        //Ajax-url
        url:'http://localhost:8080/user/deleteUser.do',

        layout:'anchor',
        defaults:{
            anchor:'100%'
        },

        defaultType:'textfield',
        items:[{
            fieldLabel:'username',
            name:'username',
            allowBlank:false
        },{
            fieldLabel:'password',
            name:'password',
            allowBlank:false
        },{
            fieldLabel:'email',
            name:'email',
            allowBlank:false
        }],
        buttons:[{
            text:'删除',
            formBind:false,
            disabled:false,
            handler: function () {
                var form = this.up('form').getForm();
                if (form.isValid()){
                    form.submit({
                        success:function (form, action) {
                            Ext.Msg.alert('删除成功',action.result.msg);
                        },
                        failure:function (form,action) {
                            Ext.Msg.alert('删除失败',action.result.msg);
                        }
                    })
                };
            }
        },{
            text:'重置',
            handler: function () {
                this.up('form').getForm().reset();
            }
        }],
    });
</script>
</body>
</html>